<template>
  <div class="certification">
    <div class="zzyimg"></div>
    <div class="item">
      <el-container>
        <el-aside class="iteml">
          <div class="Honorqualification">荣誉资质</div>
          <cooperation :en="false" />
        </el-aside>
        <el-main>
          <div class="mainitem">
            <Bread :breadArr="breadArr"></Bread>
            <engineering :images="certificationimages" />
          </div>
        </el-main>
      </el-container>
    </div>
  </div>
</template>

<script>
import Bread from "@/components/Bread";
import cooperation from "@/components/cooperation";
import engineering from "@/components/engineering";

export default {
  name: "core",
  components: {
    Bread,
    cooperation,
    engineering,
  },
  mounted() {},
  data() {
    return {
      certificationimages: [
        {
          title: "WSF水利水电工程环境管理体系认证",
          url: require("@/assets/images/hj.jpg"),
        },
        {
          title: "WSF水利水电工程职业健康安全管理体系认证",
          url: require("@/assets/images/aq.jpg"),
        },
        {
          title: "WSF水利水电工程施工质量管理体系认证",
          url: require("@/assets/images/dj.jpg"),
        },
        {
          title: "安全生产许可",
          url: require("@/assets/images/safety.jpg"),
        },
        {
          title: "建筑企业资质",
          url: require("@/assets/images/architecture.jpg"),
        },
        {
          title: "企业信用承诺书",
          url: require("@/assets/images/cl.png"),
        },
      ],
      breadArr: [
        {
          title: "荣誉资质",
          to: "/certification",
        },
      ],
    };
  },
  methods: {},
  watch: {},
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.item {
  width: 1400px;
  height: 100%;
  text-align: center;
  margin: auto;
  margin-top: 20px;
  .iteml {
    width: 300px;
    padding-right: 20px;
  }
}
.Honorqualification {
  width: 236;
  height: 97px;
  text-align: center;
  line-height: 97px;
  background: #017cc2;
  color: #fff;
  font-size: 26px;
  margin-bottom: 10px;
}
.mainitem {
  text-align: right;
}
.zzyimg {
  width: 100%;
  height: 500px;
  margin: auto;
  background: url("@/assets/images/ej.jpg");
  background-repeat: no-repeat;
  background-size: 100%;
}
</style>
